<template>
  <div class="qqq">
    
   <el-row>
    <el-card>
    <el-col span="12">
    
      
    <div ref="myechart" style="width: 600px; height: 500px"></div>
  

</el-col>
    <el-col span="12" class="yuan">
      
      <div  ref="mycicle" style="width: 600px; height: 600px"></div>
    
    
  
</el-col>
</el-card>
  </el-row>

  </div>
  
</template>

<script>
  export default {
    data(){
            return {
            
            xx:''
           
       
            
        }
    },
    created(){
        
         this.qqq();
         
        },
    mounted() {
      this.setChart()
      this.setCicle()
    },
    methods: {
      setChart() {
        var myChart = this.$echarts.init(this.$refs.myechart)
        // 指定图表的配置项和数据
        myChart.setOption({
  title: {
    text: '打卡人数'
  },
  tooltip: {},
  xAxis: {
    data: ['网络工程', '通信工程', '物联网', '计科']
  },
  yAxis: {},
  series: [
    {
      name: '打卡人数',
      type: 'bar',
      data: [20,30,40,50,80]
    }
  ]
});
      },
      setCicle(){
        var myChart = this.$echarts.init(this.$refs.mycicle);
        myChart.setOption({
  title: {
    text: '物资汇总',
    
    left: 'center'
  },
  tooltip: {
    trigger: 'item'
  },
  legend: {
    orient: 'vertical',
    left: 'left'
  },
  series: [
    {
      
      type: 'pie',
      radius: '50%',
      data: [
        { value: 1000, name: '消毒物品' },
        { value: 735, name: '口罩' },
        { value: 580, name: '体温计' },
        { value: 484, name: '防护用品' },
        { value: 300, name: '其他' }
      ],
      emphasis: {
        itemStyle: {
          shadowBlur: 10,
          shadowOffsetX: 0,
          shadowColor: 'rgba(0, 0, 0, 0.5)'
        }
      }
    }
  ]
});
 myChart.setOption(option);
      },
      qqq(){
            let xx=localStorage.getItem('xx');
              if(xx==1){
                this.$router.push({path: '/main/submit'});
              }
          }
    },
  }
</script>

<style>

  
</style>